{% extends 'video/videos/index.html' %}
{% block head1 %}
<title>视频分类</title>
{% endblock %}
{% block main %}

<div class="667616 columns" >

    <div class="f38e46 column is-2" id="mobile-menu" >

        <aside class="4e53c4 menu" :class="{'is-active': visible}">
            <h5 class="f66857 menu-label is-hidden-mobile" style="background-color: #007bff;">
                <span class="1aa3b9 icon">
                </span>
                视频分类
            </h5>
            <ul class="fd3850 menu-list">
                    <li>
                        <a class="" href="/video/category/short">短视频</a>
                    </li>
            </ul>
        </aside>
    </div>
    <script type="text/javascript">
        window.$m('mobile-menu')
    </script>
    <div class="4a391e column is-10">
        <div class="ca4e8c tabs" id="rd4">
            <ul>
                <av0 module="md100"></av0>
                <li class="4ce9a7 ml-auto is-hidden-mobile">视频列表：第 <b>{{ obj.number }}</b> 页</li>
            </ul>
        </div>
            <script type="text/javascript">
            window.$m('rd4', ["<li class=\"is-active\" v-for=\"(item, index) in list\" :key=\"item.id\">\n    <a target=\"_blank\" :href=\"item.href\">{{item.title}}<\/a>\n<\/li>"])
        </script>


<div id="rd5" class=""><div class="e71858 columns is-multiline is-mobile is-variable is-2-tablet is-1-mobile"><av0 module="md101"></av0>
    {%for video in obj%}
    <div class="e5561d column is-one-quarter-tablet is-half-mobile py-1">
    <article class="ea1e50 card is-shadowless">
        <div class="b2560e card-image is-clipped">
            <a href="/video/view/{{ video.id }}">
                <figure class="5264a6 image is-5by3 is-relative">
                    <img loading="lazy" alt="{{ video.name }}" src=" media/{{ video.picture }}">
                </figure>
                <span class="70a10f duration">00:02:24</span>

            </a>
        </div>

        <div class="8b7467 card-content px-0 py-2">
            <div class="84fdd5 content">
                <h4 class="296b3a is-size-7 is-size-7-mobile mb-1 has-text-line-2 has-text-weight-normal">
                    <a target="_self" href="/video/view/{{ video.id }}" class="a6e5a0 has-text-grey-dark">
                        {{ video.name }}                    </a>
                </h4>
                <p class="998d7d mb-1 has-text-grey is-size-8">
                    作者: <a class="8e83ec has-text-grey-dark" href="/author/{{ 作者地址 }}">{{ video.user }}</a>
                </p>
                <p class="800066 has-text-grey is-size-8">
                    <time datetime="{{ video.createdate }}">{{ video.createdate|date:"Y年m月d日" }}</time>&nbsp;|&nbsp;{{ video.click_num }}次播放
                </p>
            </div>
        </div>
    </article>
</div>
{%endfor%}
</div>
<!--
<div class="6bc44d pagination is-centered">
<ul class="179849 pagination-list">
{% if obj.has_previous %}
<li class=""><a class="c108bf pagination-link" href="/video/?page= {{ obj.paginator.previous_page_number }}">«</a></li>
<li class=""><a class="c108bf pagination-link" href="/video/?page=1">1</a></li>
{% endif %}
<li class="03d50b is-current"><a class="ff9ec7 pagination-link" href="/video/?page={{ obj.number }}">{{ obj.number }}</a></li>

{% if obj.has_next %}
    <li><span class="bd1dc2 pagination-ellipsis">...</span></li>
<li class=""><a class="198e31 pagination-link" href="/video/?page={{ obj.paginator.num_pages }}"> {{ obj.paginator.num_pages }}</a></li>
<li class=""><a class="c108bf pagination-link" href="/video/?page={{ obj.next_page_number }}" >»</a></li>
{% endif %}



<li class="2b56ea ml-3">
    <form action="/video">
        <input type="number" name="page"  class="fd38c3 input mr-2" value="1" style="width: 5rem" max="1765" min="1" />
        <button type="submit" class="0d59fa button">跳转</button>
    </form>
</li></ul></div></div>
<script type="text/javascript">
    window.$m('rd5', ["<div class=\"column is-one-quarter-tablet is-half-mobile py-1\" v-for=\"(item, index) in list\" :key=\"item.id\">\n    <div class=\"card is-shadowless\">\n        <div class=\"card-image is-clipped\">\n            <a target=\"_blank\" :href=\"item.href\">\n                <figure class=\"image is-5by3\">\n                    <img loading=\"lazy\" :alt=\"item.title\" :src=\"item.img\">\n                <\/figure>\n                <span class=\"duration\">8:08<\/span>\n            <\/a>\n        <\/div>\n        <div class=\"card-content px-0 py-2\">\n            <div class=\"content\">\n                <h4 class=\"is-size-7 mb-1 has-text-line-2 has-text-weight-normal\">\n                    <a target=\"_blank\" :href=\"item.href\" class=\"has-text-grey-dark\">\n                        {{item.title}}\n                    <\/a>\n                <\/h4>\n                <p class=\"mb-1 has-text-grey is-size-8\">\n                    \u4f5c\u8005: 46.VIP\n                <\/p>\n                <p class=\"has-text-grey is-size-8\">\n                    8\u5c0f\u65f6\u524d&nbsp;|&nbsp;8.8\u4e07\u6b21\u64ad\u653e\n                <\/p>\n            <\/div>\n        <\/div>\n    <\/div>\n<\/div>"])
</script>
    </div>
</div>-->
{% if obj.has_other_pages %}
<nav aria-label="Contacts Page Navigation">
        <ul class="pagination justify-content-center m-2">
            {% if obj.has_previous %}
            <li class="">
                <a class="page-link" href="/video/?page={{ obj.previous_page_number }}">«</a>
            </li>
            <li class="">
                <a class="page-link" href="/video/?page=1">1</a>
            </li>
            <li>
                <span class="pagination-ellipsis">...</span>
            </li>
            {% endif %}
            <li class="page-item active">
                <a class="page-link" href="/video/?page={{ obj.number }}">{{ obj.number }}</a>
            </li>
            {% if obj.has_next %}
            <li>
                <span class="pagination-ellipsis">...</span>
            </li>
            <li class="page-item">
                <a class="page-link" href="/video/?page={{ obj.paginator.num_pages }}">{{ obj.paginator.num_pages }}</a>
            </li>
            <li class="">
                <a class="page-link" href="/video/?page={{ obj.next_page_number }}">
                    <span aria-hidden="true">»</span>
                </a>
            </li>
            {% endif %}
            <li class="2b56ea ml-3">
            <form action="/video">
                <input type="number" name="page"  class="fd38c3 input mr-2" value="1" style="width: 5rem" max="1765" min="1" />
                <button type="submit" class="0d59fa button">跳转</button>
            </form>
            </li>
        </ul>


    </nav>
{% endif %}

<div class="cf848b block" id="rd6">
    <div class="a9f096 columns mt-1 is-1 is-variable is-multiline">
        <av0 module="md102"></av0>
    </div>
</div>
</div>
</div>
</div>


  {% endblock %}
